<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<style>
  /* text-transform 用于设置字体的大小写转换 一般不用 可以用js来实现 更加灵活 */
  .class1{
    /* 首字符大写 */
    text-transform: capitalize;
  }
  .class2{
    /* 全部大写 */
    text-transform: uppercase;
  }
  .class3{
    /* 全部小写 */
    text-transform: lowercase;
  }
</style>
<body>
  <div class="class1">hello world</div>
  <div class="class2">hello world</div>
  <div class="class3">HELLO WORLD</div>
</body>
</html>